<template>
    <div id="query_break_view">

      <header class="mui-bar mui-bar-nav">
        <a class=" mui-icon  mui-pull-left  arr_left" @tap="$router.go(-1)">
        </a>
        <h1 class="mui-title">查询违章</h1>
      </header>
      <div class="mui-content">
        <div class="main_box">
          <div class="title">违章</div>
          <div class="body">
            <div class="input_box">
              <span class="input_name">车牌号</span>
              <input type="" placeholder="请输入车牌号" class="input" name="" id="" value="" />
            </div>

            <div class="input_box">
              <span class="input_name">发动机号</span>
              <input type="" placeholder="请输入发动机号" class="input" name=""   value="" />
            </div>

            <div class="input_box">
              <span class="input_name">车架号</span>
              <input type="" placeholder="请输入车架号" class="input" name="" value="" />
            </div>

            <div class="input_box">
              <span class="input_name">手机号</span>
              <input type="" placeholder="请输入手机号" class="input" name=""  value="" />
            </div>

          </div>
          <div class="mui-btn query_btn">查询</div>
        </div>
      </div>
    </div>
</template>

<script>
    export default {
        name: "query_break"
    }
</script>

<style scoped>
  .mui-content {
    background-color: #ffffff;
  }
  .main_box {
    width: 14.72rem;
    margin-left: 0.64rem;
    height: 100%;
    box-shadow: 0 0 0.2133rem #ddd;
    border-radius: 0.256rem;
    overflow: hidden;
    padding-bottom: 0.8533rem;
    margin-top: 0.64rem;
  }
  .main_box .title {
    width: 100%;
    height: 1.8347rem;
    line-height: 1.8347rem;
    text-align: center;
    background-color: #1c83fc;
    color: #fff;
  }
  .main_box .body {
    padding-top: 0.64rem;
  }
  .main_box .body .input_box {
    height: 1.792rem;
    line-height: 1.792rem;
    width: 12.8rem;
    margin-left: 0.9387rem;
    border-bottom: 1px solid #dcdcdc;
  }
  .main_box .body .input_box .input_name {
    font-size: 0.6827rem;
    width: 3.2rem;
    display: inline-block;
  }
  .main_box .body .input_box .input {
    font-size: 0.6827rem;
    width: 9.088rem;
    margin: 0;

    padding: 0;
    border: none;
  }
  .main_box .query_btn {
    width: 12.8rem;
    margin-left: 0.9387rem;
    margin-top: 1.4933rem;
    border-color: #1c83fc;
    color: #1c83fc;
  }
  .bg_blue {
    background-color: #1c83fc !important;
    color: #fff;
  }
  .bg_gree {
    background-color: #f6f6f6 !important;
  }
  .weather_res {
    padding: 0.64rem;
  }
  .weather_res .panel {
    width: 100%;
    min-height: 3.072rem;
    background-color: #fff;
    border-radius: 0.256rem;
    margin-bottom: 0.4267rem;
    padding-bottom: 0.4267rem;
    padding-top: 0.4267rem;
  }
  .weather_res .panel .title {
    color: #1c83fc;
  }
  .weather_res .panel .icon_img2 {
    width: 2.3893rem;
    height: 2.3893rem;
    float: left;
    margin-left: 0.8533rem;
  }
  .weather_res .panel .icon_img2 img {
    width: 100%;
  }
  .weather_res .panel .right_info {
    width: 7.68rem;
    float: right;
    color: #353535;
    line-height: 2.3893rem;
    font-size: 0.768rem;
    margin-right: 0.8533rem;
    text-align: right;
  }
  .weather_res .panel .right_info .week {
    float: left;
  }
  .weather_res .break {
    padding-left: 0.8533rem;
    padding-top: 0.8533rem;
  }
  .weather_res .break .title {
    font-size: 0.6827rem;
  }
  .weather_res .break p {
    font-size: 0.4693rem;
  }
  .weather_res .break p .break_date {
    float: right;
    margin-right: 0.8533rem;
  }
  .weather_res .top_panel .date {
    height: 1.7067rem;
    line-height: 1.7067rem;
    font-size: 0.6827rem;
    text-align: center;
    color: #353535;
  }
  .weather_res .top_panel .icon_img {
    margin-left: 0.8533rem;
    width: 4.2667rem;
    height: 4.2667rem;
    float: left;
  }
  .weather_res .top_panel .icon_img img {
    width: 100%;
  }
  .weather_res .top_panel .temp {
    float: right;
    color: #353535;
    font-size: 1.4933rem;
    margin-right: 0.8533rem;
    margin-top: 0.64rem;
  }
  .weather_res .top_panel .temp .address {
    margin-top: 0.4267rem;
    text-align: right;
    font-size: 0.8747rem;
  }
  .weather_res .top_panel .bottom {
    font-size: 0.64rem;
    line-height: 1.28rem;
    height: 1.28rem;
    color: #353535;
    clear: both;
    padding-left: 0.8533rem;
  }
  .res_list {
    color: #353535;
  }
  .res_list .item {
    width: 16rem;
    padding-left: 0.64rem;
    padding-right: 0.64rem;
    font-size: 0.5973rem;
    padding-top: 0.4267rem;
    padding-bottom: 0.4267rem;
    background-color: #fff;
    border-bottom: 1px solid #e1e1e1;
  }
  .res_list .item .line1 span:nth-child(1) {
    font-size: 0.5973rem;
    color: #000;
  }
  .res_list .item .line1 span:nth-child(2) {
    font-size: 0.5547rem;
    color: #000;
  }
  .res_list .item .line1 span:nth-child(2) div {
    font-size: 0.4693rem;
  }
  .res_list .item .line1 .icon_img {
    display: inline-block;
    width: 0.5547rem;
    height: 0.5547rem;
    background-size: 100% 100%;
    vertical-align: middle;
  }
  .res_list .item .line1 span:nth-child(3) {
    font-size: 0.4693rem;
    color: #aaa;
  }
  .res_list .item .line1 span:nth-child(4) {
    font-size: 0.5547rem;
    color: #000;
  }
  .res_list .item .line1 span:nth-child(4) div {
    font-size: 0.4693rem;
  }
  .res_list .item .line2 span {
    font-size: 0.512rem;
  }
  .res_list .item .block {
    overflow: hidden;
  }
  .res_list .item .block span {
    float: left;
    width: 25%;
  }
  .air_res_list .item {
    background-color: #fff;
    padding: 0.2133rem 0;
    width: 14.72rem;
    min-height: 2.1333rem;
    margin-left: 0.64rem;
    margin-top: 0.4267rem;
    position: relative;
  }
  .air_res_list .item .block {
    margin-left: 0.4267rem;
    margin-top: 0.4267rem;
    overflow: hidden;
  }
  .air_res_list .item .block .time {
    color: #353535;
    float: left;
  }
  .air_res_list .item .block .time span {
    font-size: 1.0667rem;
  }
  .air_res_list .item .block .center {
    padding-top: 0.384rem;
    padding-left: 0.64rem;
    padding-right: 0.64rem;
  }
  .air_res_list .item .right {
    position: absolute;
    right: 0.4267rem;
    top: 0.8533rem;
    color: #aaa;
    font-size: 0.64rem;
    text-align: center;
  }
  .air_res_list .item .bottom {
    margin-left: 0.4267rem;
  }
</style>
